<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
    <title>添加房卡</title>
   	<script type="text/javascript" src="${pageContext.request.contextPath}/js/theme/jquery.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/layerui/layer.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/layerui/layer.ext.js"></script>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/skin/css/mobilecss/charge.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/skin/css/mobilecss/main.css"> 
	<style type="text/css">
	
       /*  body {
            padding-bottom: 40px;
			padding-top:20px;
            margin-top:5px;
            
        }
        .sidebar-nav {
            padding: 9px 0;
        }

        @media (max-width: 980px) {
            /* Enable use of floated navbar text */
            .navbar-text.pull-right {
                float: none;
                padding-left: 5px;
                padding-right: 5px;
            }
        } */
	</style>
</head>
<body>
 <div class="container">
        <h3>代理商名称：<span>${adduser.userName}</span></h3>
        <h3>当前房卡余额：<span id="cardLeftId">${totalCard}</span>张</h3>
        <div class="shou_info" id="userInfodiv" >
       <!--  <p>充房卡</p> -->
            <input type="hidden" name="userId" id="userId" value="${adduser.id}">
            <input type="hidden" name="gameId" id="gameId" value="${adduser.gameUserId}">
            <div style="position: relative;display: none;" id="taocanDivId">
                <span  style="width: 30%;display: inline-block" >
                    <input type="radio" id="taocan" name="buyCardName" value="1" checked="checked" ><label for="taocan">套餐</label>
                </span>
                <select style="width: 56%;display: inline-block;border: 1px solid #636363;padding: 0.4rem;color: #999" id="buyCardGroupId" style="height:34px;width:80%;">
	                <option value="1">零售，1元1张</option>
			        <option value="13">10元12张，送1张</option>
			        <option value="40">30元36张，送4张</option>
			        <option value="90">60元80张，送10张</option>
			        <option value="180">100元160张，送20张</option>
                </select>
                <input type="radio" id="mine" name="buyCardName" value="2" checked="checked" ><label for="mine" >自定义</label>
            </div>
            <div id="zidingyiDivId">
                <span  style="width: 20%;display: inline-block">
                	充卡数量：
                </span>
                <input type="tel" placeholder="请输入充卡的数量"  style="width: 78.9%" id="mineCardNumId"  >
				<input type="text"  style="width: 61%;border:none;margin-left:30%;color:#999;" id="mineCardNum"  >
            </div>
            <div id="zidingyiGiftDivId" style="display: none;">
                <span  style="width: 30%;display: inline-block;text-align: center;font-weight: bold">赠送</span>
                <input type="tel"  style="width: 56%" id="giftCardNumId">
				<input type="text"  style="width: 61%;border:none;margin-left:30%;color:#999;" id="giftCardNum"  >
            </div>
            <div style="border: 1px solid #636363">
                <span style="border:none;padding: 0.5rem;">充卡备注</span>
                <input type="text" placeholder="选填，仅对你可见" style="border: none;width: 60%" id="descriptionId" >
            </div>
            <div>
                <button style="width: 100%" id="done" onclick="buyCardClick()">
                                确认充卡
                </button>
            </div>
        </div>
    </div>
    
    <div class="alert" id="alertDivId" style="display: none">
        <div >
            <p>共充卡<span id="confirmCardTotalId"></span>张</p>
            <p>包括：<span id="taocanConfirmId"></span></p>
            <p style="margin-top:1rem">收卡方信息</p>
			<p id="realNameConfirmId">代理商：${adduser.userName}</p>
            <p id="roleNumConfirmId">电话：${adduser.phone}</p>
            <!-- <p id="isUsedConfirmLbl">状态：<span id="isUsedConfirmId"></span></p> -->
            <div>
                <button id="ok" onclick="confirmBuyCardClick()">确认充卡</button>
                <button style="background-color: #666;margin-left: 5%" id="close" onclick="closeAlertClick()">取消</button>
            </div>
        </div>
    </div>

<%-- <table class="table table-bordered table-hover definewidth m10">
    <tr>
        <td width="30%" style="text-align: right;" class="tableleft"> 代理商名称 </td>
        <td>
        <input type="text" name="userId" id="userId" value="${adduser.id}">
        ${adduser.userName} </td>
    </tr>
    
    <tr>
        <td style="text-align: right;" class="tableleft">状&nbsp;&nbsp;态</td>
        <td> ${playerInfo.status} 正常
        </td>
    </tr>
    <tr>
        <td style="text-align: right;" class="tableleft">房卡余额</td>
        <td>
            ${adduser.totalCard}
        </td>
    </tr>
    <tr>
        <td style="text-align: right;" class="tableleft"> 
        <input type="radio" name="buyCardGroupId" checked="checked" value="1">
        	 套&nbsp;&nbsp; 餐  </td>
        <td> 
        <select name="func" id="func">
	        <option value="1">零售，1元1张</option>
	        <option value="2">10元12张，送1张</option>
	        <option value="3">30元36张，送4张</option>
	        <option value="4">60元80张，送10张</option>
	        <option value="5">100元160张，送20张</option>
        </select>
         </td>
    </tr>
    <tr>
        <td style="text-align: right;" class="tableleft"> 
        <input type="radio" name="buyCardGroupId" value="2" >
        	 自定义  </td>
        <td><input type="text" name="card" id="card" value="0"/></td>
    </tr>
    <tr>
        <td style="text-align: right;" class="tableleft"> 赠&nbsp;&nbsp;送  </td>
        <td><input type="text" name="awardCard" id="awardCard" value="0"/></td>
    </tr>
    <tr>
        <td style="text-align: right;" class="tableleft"> 备&nbsp;&nbsp;注  </td>
        <td><input type="text" name="remark" id="remark"/></td>
    </tr>
    <tr>
        <td class="tableleft"></td>
        <td>
            <button type="button" id="usersave" class="btn btn-primary" type="button">充值</button> &nbsp;&nbsp;<button type="button" class="btn btn-success" name="backid" id="backid">关闭</button>
        </td>
    </tr>
</table> --%>


</body>
<script>
    
    function confirmBuyCardClick() {
		if($('#isUsedId').html() == '已冻结') {
			layer.alert('该账户已冻结，暂时不能充卡');
			$(".alert").css('display', 'none');
			return;
		}
		$('#ok').attr('disabled',"true"); //添加disabled属性 
		var userId = $("#userId").val();
		var gameId = $("#gameId").val();
		var card = Number($.trim($('#mineCardNumId').val().replace(/\,/g,"")))==''?0:Number($.trim($('#mineCardNumId').val().replace(/\,/g,"")));
		var awardCard = Number($.trim($('#giftCardNumId').val().replace(/\,/g,"")))==''?0:Number($.trim($('#giftCardNumId').val().replace(/\,/g,"")));
		var remark =$("#descriptionId").val();
		var func = $('#buyCardGroupId option:selected').val();
		var buyCardGroupId = $('input[name="buyCardName"]:checked').val();
		if(card==""&&func==""){
			layer.alert("请填写充值信息");
			return;
		}
		$.post("${pageContext.request.contextPath}/admin/card_add_save.html",
	        {"userId":userId,"card":card,"awardCard":awardCard,"gameId":gameId
			,"remark":remark,"func":func,"buyCardGroupId":buyCardGroupId},
	       function(data){
            	var json = eval("("+data+")");
				layer.alert(json.message);
				$('#ok').removeAttr("disabled");  //移除disabled属性 
				if(json.statusCode =='200'){
					$("#cardLeftId").html(parseInt($("#cardLeftId").html())+parseInt($('#confirmCardTotalId').html()));
					setTimeout("closeAlertClick()",2000);
				}
	      });
		
    	$(".alert").css('display', 'none');
    }
    
    function buyCardClick() {
    	var type = $('input:radio[name="buyCardName"]:checked').val();
    	var diamond="";
    	if(type == "2") {
    		diamond = Number($.trim($('#giftCardNumId').val().replace(/\,/g,""))) + Number($.trim($('#mineCardNumId').val().replace(/\,/g,"")));
        	var taocanTipStr = "包含购卡" + $.trim($('#mineCardNumId').val().replace(/\,/g,"")) + "张";
        	if(parseInt($.trim($('#giftCardNumId').val().replace(",",""))) > 0) {
        		taocanTipStr = taocanTipStr + "；赠卡" + $.trim($('#giftCardNumId').val().replace(/\,/g,"")) + "张";
        	}
    		$('#taocanConfirmId').html(taocanTipStr);
    	} else {
    		diamond = $('#buyCardGroupId').val();
        	$('#taocanConfirmId').html($('#buyCardGroupId option:selected').text());
    	}
    	
    	if(diamond=="") {
    		layer.alert( '房卡数量不能为空！');
    		return;
    	} else if( diamond < 0) {
    		layer.alert( '房卡数量必须是大于0的数字！');
    		return;
    	} else if(diamond.length > 9) {
    		layer.alert( '房卡数量长度必须小于9位数！');
    		return;
    	}
    	$(".alert").css('display', 'block');
    	$('#confirmCardTotalId').html(diamond);
    	$('#realNameConfirmId').html($('#roleNameId').html());
    	$('#roleNumConfirmId').html($('#roleNumId').html());
    	$('#isUsedConfirmId').html($('#isUsedId').html());
    }
    
    function closeAlertClick() {
		$('.alert').css('display', 'none');
	}
    
    $('#mineCardNumId').bind('input propertychange', function() {
		$('#mineCardNumId').val(thousandBitSeparator($(this).val()));
		$('#mineCardNum').val(DX($('#mineCardNumId').val()));
    });
	$('#giftCardNumId').bind('input propertychange', function() {
		$('#giftCardNumId').val(thousandBitSeparator($(this).val()));
		$('#giftCardNum').val(DX($('#giftCardNumId').val()));
	}); 
	function thousandBitSeparator(t)
    {
      var stmp = "";
      if(t==stmp) return;
      var ms = t.replace(/[^\d\.]/g,"").replace(/(\.\d{2}).+$/,"$1").replace(/^0+([1-9])/,"$1").replace(/^0+$/,"0");
      var txt = ms.split(".");
      while(/\d{4}(,|$)/.test(txt[0]))
        txt[0] = txt[0].replace(/(\d)(\d{3}(,|$))/,"$1,$2");
      t = stmp = txt[0]+(txt.length>1?"."+txt[1]:"");
      return t
    }
	function DX(num) {
		var n = num.replace(/[^0-9]/g,'');
		if (!/^(0|[1-9]\d*)(\.\d+)?$/.test(n))
		return "数据非法";
		var unit = "千百拾亿千百拾万千百拾元角分", str = "";
		n += "00";
		var p = n.indexOf('.');
		if (p >= 0)
		n = n.substring(0, p) + n.substr(p+1, 2);
		unit = unit.substr(unit.length - n.length);
		for (var i=0; i < n.length; i++)
		str += '零壹贰叁肆伍陆柒捌玖'.charAt(n.charAt(i)) + unit.charAt(i);
		return str.replace(/零(千|百|拾|角)/g, "零").replace(/(零)+/g, "零").replace(/零(万|亿|元)/g, "$1").replace(/(亿)万|壹(拾)/g, "$1$2").replace(/^元零?|零分/g, "").replace(/元$/g, "整");
	}
   
</script>
</html>